<template>
  <div>
    <div class="top">
      <van-cell-group>
        <van-cell title="历史搜索" />
      </van-cell-group>

      <van-icon name="delete-o" @click="shanchu" />
    </div>

    <van-tag plain type="primary" v-for="(item, index) in searchHistoryData" v-show="xianshi" @click="heerweiyi(item)"
      :key="index">{{ item
      }}</van-tag>
    <van-cell-group>
      <van-cell title="热门搜索" />

    </van-cell-group>
    <van-tag plain type="primary" v-for="(item, index) in searchHotData" :key="index"
      @click="heerweiyi(item.keyword)">{{ item.keyword }}</van-tag>
  </div>
</template>

<script>
import Vue from 'vue';
import { Cell, CellGroup } from 'vant';
import { Tag } from 'vant';
import { Icon } from 'vant';
import { qlishiData } from '@/api/dellishi'

Vue.use(Icon);

Vue.use(Tag);
Vue.use(Cell);
Vue.use(CellGroup);
export default {
  name: '',
  data() {
    return {
      xianshi: true,
    };
  },
  props: ['searchHotData', 'searchHistoryData'],
  methods: {
    shanchu() {
      qlishiData().then(res => {
        console.log('清除历史记录', res);
        this.xianshi = false
      })
    },
    heerweiyi(m) {
      this.$emit('heerweiyi', m)
    }
  },



}

</script>
<style lang="less" scoped>
.top {
  display: flex;
  justify-content: space-between;
}

.van-tag {
  margin-left: 3px;
}
</style>